
 <div id="cut_div"  style="display:NONE;">
 	<script type="text/javascript" src="${statics}/plugins/Jcrop/js/jquery.Jcrop.min.js" ></script>
 	<link rel="stylesheet" href="${statics}/plugins/Jcrop/css/jquery.Jcrop.css" type="text/css" /> 
	<img id="cutP" src=""/>
	<input type="hidden" id="cut_img_id" value=""/>
	<input type="hidden" id="cut_path_id" value=""/>
	<input type="button" value="剪裁" onClick="doCut()"/>	
 			<input type="hidden" id="x" name="x" />
			<input type="hidden"  id="y" name="y" />
			<input type="hidden"  id="w" name="w" />
			<input type="hidden"  id="h" name="h" />
<script>
	function doCut(){
	if($("#x").val()==""){
		alert("请用鼠标滑动图片选择裁剪点");
		return;
	}
    $.ajax ({
        url: base + "/cut!cut",
        data:  {
    				"labelX":$("#x").val(),
    				"labelY":$("#y").val(),
    				"width":$("#w").val(),
    				"height":$("#h").val(),
    				"srcPath":$("#cutP").attr("src")
        		},
        async: false,
        type:'POST',
        success: function(webPath){
        	$("#"+$("#cut_img_id").val()).attr("src",webPath);
			$("#"+$("#cut_path_id").val()).attr("value",webPath);
			closeDialog();
        }
    });
	}
	function showCoords(c)
	{
		jQuery('#x').val(c.x);
		jQuery('#y').val(c.y);
		jQuery('#w').val(c.w);
		jQuery('#h').val(c.h);
	};
	
	//第一个是图片dom，第二个是图片隐藏域id
	function openCut(input,cut_path_id){
		input = $(input);
		$("#cutP").attr("src",input.attr("src"));
		$("#cut_img_id").val(input.attr("id"));
		$("#cut_path_id").val(cut_path_id);
		dialog("剪裁", "id:cut_div", "1200px", "400px", "id");
		jQuery('#cutP').Jcrop({
				onChange: showCoords,
				onSelect: showCoords
		});
	}
</script>
</div>